package top.jidanmian.android.iot.ui.device

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Button
import androidx.compose.material3.Card
import androidx.compose.material3.ElevatedButton
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel
import top.jidanmian.android.iot.R
import top.jidanmian.android.iot.ui.theme.AppTheme

@Composable
fun LightView(
    model: LightViewModel = hiltViewModel()
) {
    val uiState by model.uiState.collectAsState()
    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(16.dp)
    ) {
        Card(
            modifier = Modifier.fillMaxWidth(),
        ) {
            Surface(
                modifier = Modifier.fillMaxWidth(),
                color = if (uiState.onOff) MaterialTheme.colorScheme.secondary else MaterialTheme.colorScheme.surfaceVariant
            ) {
                Row(
                    modifier = Modifier.padding(16.dp),
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    ElevatedButton(
                        onClick = {
                            model.toggle()
                        },
                    ) {
                        Icon(
                            painter = painterResource(id = R.drawable.baseline_power_settings_new_24),
                            contentDescription = "switch"
                        )
                    }
                }
            }
        }
        
        Button(onClick = { model.test() }) {
            Text(text = "测试是否能重新连接")
        }
    }
}

@Preview(showBackground = true)
@Composable
fun LightViewPreview() {
    AppTheme {
        LightView()
    }
}